<template>
  <custom-group-title title="常用应用">
    <view class="right-btn flex-row" v-if="isShowRight" @tap="rightBtnClick">
      <tm-text :font-size="24" color="grey-1" :label="rightTitle"></tm-text>
      <tm-icon :fontSize="24" name="tmicon-angle-right" color="grey-1"></tm-icon>
    </view>
  </custom-group-title>
  <tm-grid :col="4" _class="flex-col" transprent>
    <tm-grid-item :height="150" @click="itemClick">
      <image
        style="width: 60rpx; height: 60rpx"
        src="@/static/images/addorder_icon.png"
        mode=""
      ></image>
      <tm-text _class="pt-10" :font-size="22" label="宫格文本"></tm-text>
    </tm-grid-item>
    <tm-grid-item :height="150" @click="itemAddClick" v-if="isAdd">
      <tm-icon :font-size="60" name="tmicon-plus-square" color="grey-1"></tm-icon>
      <view class="" style="height: 30rpx"></view>
    </tm-grid-item>
  </tm-grid>
</template>

<script setup lang="ts">
defineProps({
  sourceArr: {
    type: Array,
    required: true,
    default: () => {
      return [];
    }
  },
  isAdd: {
    type: Boolean,
    default: false
  },
  isShowRight: {
    type: Boolean,
    default: false
  },
  rightTitle: {
    type: String,
    default: "全部"
  }
});

const emits = defineEmits(["rightBtnClick"]);
// 标题栏右边按钮的点击事件
function rightBtnClick() {
  emits("rightBtnClick");
}
// item的点击事件 除了新增
function itemClick() {
  uni.navigateTo({
    url: "/pages_application/location_map/location_map"
  });
}
// 添加按钮的点击事件
function itemAddClick() {}
</script>

<style lang="scss" scoped>
.content {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
}
.right-btn {
  display: flex;
  font-weight: normal;
  font-size: 24rpx;
}
</style>
